<template>
  <view class="app-container">
    <div class="pwdlogin-container">
      <u-input border="bottom" clearable type="number" v-model="phone" placeholder="请输入手机号码"></u-input>
      <u-input border="bottom" clearable type="password" v-model="password" placeholder="请输入密码"></u-input>
      <div class="forget" @click="onForget">忘记密码？</div>
      <u-button type="primary" shape="circle" text="登录" @click="onLogin"></u-button>
    </div>
  </view>
</template>

<script>
export default {
  data() {
    return {
      phone: '',
      password: ''
    }
  },
  methods: {
    onForget() {
      uni.navigateTo({
        url: '/pages/forgetpwd/forgetpwd'
      })
    },
    onLogin() {
      this.$store.dispatch('login', { phone: this.phone, password: this.password, channel: 'starsmoon' })
    }
  }
}
</script>

<style lang="scss">
.app-container {
  background-color: #fff !important;
  .pwdlogin-container {
    padding-top: 40px;
    .u-input {
      margin-bottom: 12px;
    }
    .forget {
      text-align: right;
      color: #00b6fc;
      font-size: 12px;
      margin-bottom: 24px;
    }
  }
}
</style>
